<template>
  <div>
    <div>
      <el-form ref="userForm" :model="user" label-width="80px">
        <el-form-item label="姓名">
          <el-input v-model="user.username"></el-input>
        </el-form-item>
        <el-form-item label="密码">
          <el-input type="password" v-model="user.password"></el-input>
        </el-form-item>

        <el-form-item label="性别">
          <el-radio-group v-model="user.sex">
            <el-radio :label="1">男</el-radio>
            <el-radio :label="0">女</el-radio>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="家庭住址">
          <el-input type="textarea" v-model="user.addr"></el-input>
        </el-form-item>

        <el-form-item label="是否是管理员">
          <el-radio-group v-model="user.isAdmin">
            <el-radio :label="true">是</el-radio>
            <el-radio :label="false">否</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>
    </div>

    <div>
      <el-button type="primary" @click="submitForm">确认</el-button>
      <el-button>取消</el-button>
    </div>

  </div>
</template>

<script>
  import axios from "axios";

  export default {
    name: "JSONStringTest",
    data () {
      return {
        user: {
          username: "",
          password: "",
          sex: 1,
          addr: "",
          age: 0,
          isAdmin: true
        }
      }
    },
    methods: {
      submitForm (formName) {
        // // console.log(formName);
        // // console.log(this.$refs['userForm']);
        //
        // console.log(this.user);
        // console.log(this.user.isAdmin);
          let url = "user/register";
          let userStr = JSON.stringify(this.user);
          this.postRequest(url, userStr).then(res => {
            console.log(res);
          }).catch(err => {
            console.log(err);
          });
        // /**
        //  * 使用原生axios 发post请求
        //  */
        // axios({
        //   method: 'post',
        //   url: 'http://localhost:8081/user/register2',
        //   headers: {
        //     'Content-Type': 'application/json'
        //   },
        //   data: {
        //     userStr
        //   }
        // }).then(res => {
        //   console.log(res);
        // }).catch(err => {
        //   console.log(err);
        // })


      }
    }
  }
</script>

<style scoped>

</style>
